<template>
  <view>
    <view>
      <uni-notice-bar showIcon :text="`标注的红色项为必填项`" />
    </view>
    <view style="padding: 0 15rpx 10rpx 10rpx;">
      <scroll-view style="height: 80vh;" :scroll-y="true">
        <uni-forms ref="patientInfoForm" :labelWidth="100" labelPosition="top" errShowType="toast"
          :rules="patientInfoRules" :model="patientInfo">
          <uni-forms-item required label="姓名" name="name">
            <uni-easyinput placeholder="请输入真实姓名" type="text" v-model="patientInfo.name" />
          </uni-forms-item>
          <uni-forms-item required label="身份证号" name="idCard">
            <uni-easyinput placeholder="请输入" type="idcard" v-model="patientInfo.idCard" />
          </uni-forms-item>
          <uni-forms-item required label="民族" name="nation">
            <uni-data-picker :clearIcon="false" :localdata="nationRange" v-model="patientInfo.nation"
              popupTitle="请选择" />
          </uni-forms-item>
          <uni-forms-item required label="学历" name="education">
            <uni-data-picker :clearIcon="false" :localdata="educationRange" v-model="patientInfo.education"
              popupTitle="请选择" />
          </uni-forms-item>
          <uni-forms-item required label="户籍类型" name="census">
            <uni-data-picker :clearIcon="false" :localdata="censusRange" v-model="patientInfo.census"
              popupTitle="请选择" />
          </uni-forms-item>
          <uni-forms-item required label="婚姻状况" name="marriage">
            <uni-data-picker :clearIcon="false" :localdata="marriageRange" v-model="patientInfo.marriage"
              popupTitle="请选择" />
          </uni-forms-item>
          <uni-forms-item required label="手机号码" name="phone">
            <uni-easyinput placeholder="请输入" type="number" v-model="patientInfo.phone" />
          </uni-forms-item>
          <uni-forms-item required label="户籍地区" name="hAddressId">
            <data-picker :clearIcon="false" popupTitle="请选择户籍地区" :loadUrl="addressUrl" :localdata="hjAddressRange"
              v-model="hjLightPath" @nodeclick="onHJNodeChange" />
          </uni-forms-item>
          <uni-forms-item required label="户籍详细地址" name="hAddress">
            <uni-easyinput placeholder="请输入" type="text" v-model="patientInfo.hAddress" />
          </uni-forms-item>
          <uni-forms-item required label="现居地区" name="jAddressId">
            <data-picker :clearIcon="false" popupTitle="请选择现居地区" :loadUrl="addressUrl" :localdata="xjAddressRange"
              v-model="xjLightPath" @nodeclick="onXJNodeChange" />
          </uni-forms-item>
          <uni-forms-item required label="现居详细地址" name="jAddress">
            <uni-easyinput placeholder="请输入" type="text" v-model="patientInfo.jAddress" />
          </uni-forms-item>
        </uni-forms>
      </scroll-view>
    </view>
    <view class="text-center" style="padding-top: 15rpx;">
      <button class="btn-df text-white" @tap="savePatientBasicInfo">保存</button>
    </view>
  </view>
</template>

<script setup>
  // 民族
  const nationRange = ref([])
  // 学历
  const educationRange = ref([])
  // 户籍类型
  const censusRange = ref([])
  // 婚姻状况
  const marriageRange = ref([])
  // 地址
  const addressUrl = ref('/interface/getAddress')
  const hjAddressRange = ref([])
  const hj = ref({})
  const hjLightPath = ref([])
  const xjAddressRange = ref([])
  const xj = ref({})
  const xjLightPath = ref([])
  // 患者信息
  const patientInfo = ref({
    nation: '汉',
    education: '初中',
    census: '农村',
    marriage: '20',
    genderId: '0',
    countryId: '0',
  })
  const patientInfoForm = ref()
  const patientInfoRules = ref({
    name: {
      rules: [{
        required: true,
        errorMessage: '姓名不能为空'
      }]
    },
    idCard: {
      rules: [{
        required: true,
        errorMessage: '身份证号不能为空'
      }]
    },
    nation: {
      rules: [{
        required: true,
        errorMessage: '民族不能为空'
      }]
    },
    education: {
      rules: [{
        required: true,
        errorMessage: '学历不能为空'
      }]
    },
    census: {
      rules: [{
        required: true,
        errorMessage: '户籍类型不能为空'
      }]
    },
    marriage: {
      rules: [{
        required: true,
        errorMessage: '婚姻状况不能为空'
      }]
    },
    phone: {
      rules: [{
        required: true,
        errorMessage: '手机号不能为空'
      }, {
        format: 'number',
        errorMessage: '手机号只能输入数字'
      }]
    },
    hAddressId: {
      rules: [{
        required: true,
        errorMessage: '户籍地区不能为空'
      }]
    },
    hAddress: {
      rules: [{
        required: true,
        errorMessage: '户籍详细地址不能为空'
      }]
    },
    jAddressId: {
      rules: [{
        required: true,
        errorMessage: '现居地区不能为空'
      }]
    },
    jAddress: {
      rules: [{
        required: true,
        errorMessage: '现居详细地址不能为空'
      }]
    },
  })

  onLoad((options) => {
  })
  onMounted(() => {
    // 民族
    let nationList = uni.getStorageSync('nationRange');
    nationRange.value = nationList || [];
    // 学历
    let educationList = uni.getStorageSync('educationRange');
    educationRange.value = educationList || [];
    // 户籍类型
    let censusList = uni.getStorageSync('censusRange');
    censusRange.value = censusList || [];
    // 婚姻状况
    let marriageList = uni.getStorageSync('marriageRange');
    marriageRange.value = marriageList || [];
    // 地址
    let provinceRange = uni.getStorageSync('provinceRange');
    hjAddressRange.value = provinceRange || [];
    xjAddressRange.value = provinceRange || [];
  })

  const onIdCardBlur = () => {}

  const onHJNodeChange = (node) => {
    hj.value = JSON.parse(JSON.stringify(node)) || {};
    console.log('onHJNodeChange: hj ==> ', hj.value);
    patientInfo.value.hAddressId = node.id;
    patientInfo.value.hLightPathCode = node.lightPath;
    patientInfo.value.hlightPathName = node.allName;

    hjLightPath.value = node.lightPath.split('-') || [];
    console.log('onHJNodeChange: hjLightPath ==> ', hjLightPath.value);
  }

  const onXJNodeChange = (node) => {
    xj.value = JSON.parse(JSON.stringify(node)) || {};
    console.log('onXJNodeChange: xj ==> ', xj.value);
    patientInfo.value.jAddressId = node.id;
    patientInfo.value.jLightPathCode = node.lightPath;
    patientInfo.value.jlightPathName = node.allName;

    xjLightPath.value = node.lightPath.split('-') || [];
    console.log('onXJNodeChange: xjLightPath ==> ', xjLightPath.value);
  }

  const onSync = () => {
    onXJNodeChange(hj.value)
    patientInfo.value.jAddress = patientInfo.value.hAddress;
  }

  // 保存病人基本信息
  const savePatientBasicInfo = () => {
    patientInfoForm.value.validate().then(res => {
      console.log('validate success ==》', res);
      let param = {
        ...patientInfo.value,
      }
      http.post('/interface/savePatientInfo', {
        ...res,
      }).then((res) => {
        if (res.success) {
          let result = res.result || {};
          uni.navigateTo({
            url: '/pages/medicalHistory/medicalHistory?item=' + encodeURIComponent(JSON.stringify(result))
          })
        }
      })
    }).catch(err => {
      console.log('err', err);
    })
  }
</script>

<style scoped lang="scss">
  @use './patientArchive.scss';
</style>
